<template>
  <div>
    <img class="logo" src="../assets/logo.png" alt="">

    <van-form @submit="onSubmit">
      <van-cell-group>
        <van-field v-if="type == '老师'" v-model="teacherNo" name="teacherNo" label="工号" placeholder="工号"
          :rules="[{ required: true, message: '请填写学号' }]" />
          
        <van-field v-if="type == '学生'" v-model="idCardNo" name="idCardNo" label="学号" placeholder="学号"
          :rules="[{ required: true, message: '请填写学号' }]" />

        <van-field v-model="password" type="password" name="password" label="密码" placeholder="密码"
          :rules="[{ required: true, message: '请填写密码' }]" />
      </van-cell-group>

      <van-field name="type" label="类型">
        <template #input>
          <van-radio-group v-model="type" direction="horizontal">
            <van-radio name="老师">老师</van-radio>
            <van-radio name="学生">学生</van-radio>
          </van-radio-group>
        </template>
      </van-field>

      <div style="margin: 16px;">
        <van-button round block type="primary" native-type="submit">
          登录
        </van-button>
      </div>
    </van-form>
  </div>
</template>
<style scoped>
.logo {
  width: 200px;
  height: 200px;
  display: block;
  margin: auto;
}
</style>

<script setup>

import { ref } from 'vue';
import { useRouter } from 'vue-router'
import { setUser } from '@/stores/useUser'
import request from '@/utils/request'
import { showNotify } from 'vant';

const router = useRouter()
const idCardNo = ref('123456');
const teacherNo = ref('123456789');
const password = ref('123456');
const type = ref('学生');

const onSubmit = (values) => {
  request.post("/wx/login",values).then(resp => {
    console.log('submit', values);
    console.log('resp', resp);
    if (resp.data.code == 0) {
      console.log(resp.data.data)
      setUser(resp.data.data)
      localStorage.setItem('type', type.value)
      router.push('/behavior')
    } else {
      showNotify(resp.data.msg);
    }
  });
};
</script>
